<template>
  <div id="app">
    <navigation :show="show" :width="width"></navigation>
    <keep-alive :exclude="['product_detail','journalism_detail','college_detail']">
      <router-view :width="width"></router-view>
    </keep-alive>
    <bottom></bottom>
  </div>
</template>

<script>
import navigation from '@/components/navigation.vue'
import bottom from '@/components/bottom.vue'

export default {
  name: 'App',
  components: { navigation, bottom },
  data() {
    //这里存放数据
    return {
      show: false,
      width: '',
    }
  },
  mounted() {
    this.scroll()
    window.onscroll = () => {
      this.scroll()
    }
    this.handleResize()
    window.addEventListener('resize', this.handleResize);
    window.localStorage.setItem('locale', 'zh-CN');
  },
  methods: {
    scroll() {
      const scrollPos = window.scrollY || window.scrollTop || document.getElementsByTagName('html')[0].scrollTop
      if (scrollPos > 400) {
        this.show = true
      } else if (scrollPos < 400) {
        this.show = false
      }
    },
    handleResize() {
      this.width = window.innerWidth
    }
  }
}
</script>

<style></style>
